{template '_header'}

<style>
    .fui-tab.fui-tab-danger a.active {
        color: #ef5e14;
        border-color: #ef5e14;
    }
    .fui-list-group.task-list {
        background: none;
    }
    .fui-list-group.task-list .fui-list {
        background: #fff;
        margin-top: 0.5rem;
        border-radius: 0.5rem;
    }
    .fui-list-group.task-list .fui-list:before {
        border: 0;
    }
    .fui-list-group.task-list .fui-list-media {
        width: 1.2rem;
        text-align: right;
    }
    .fui-list-group.task-list .fui-list-media i.icon {
        height: 1.5rem;
        width: 1.2rem;
        font-size: 1rem;
    }

    .tag {
        height: auto;
        padding: 0.05rem 0.2rem;
        color: #fff;
        font-size: 0.6rem;
        border-radius: 0.2rem;
        vertical-align: bottom;
    }
    .tag.tag-blue {
        background: #17b1ee;
    }
    .tag.tag-blue2 {
        background: #00d2e5;
    }
    .tag.tag-pink {
        background: #f55690;
    }
    .tag.tag-orange {
        background: #ff6d00;
    }
    .tag.tag-red {
        background: #f74b4b;
    }
    .tag-success{
        background: #5cb85c;
    }
    .tag-primery{
        background: #428bca;
    }
    .tag.tag-big {
        padding: 0.1rem 0.2rem;
    }

    .btn-danger.task-btn {
        padding: 0.2rem 0.3rem;
        height: 1.5rem;
        line-height: 1.1rem;
        font-size: 0.7rem;
        color: #ffffff;
        border-color: #ef5e14;
        background-color: #ef5e14;
    }
    .task-num {
        padding: 0;
        margin: 0;
        line-height: 0.7rem;
        font-size: 0.7rem;
        color: #818181;
        text-align: center;
    }

    .task-modal{
        width: 13rem;
        position: absolute;
        top:-28rem;
        left:3rem;
        background-color: #ffffff;
        border-radius: 20px;
    }
    .task-btn-close{
        position: absolute;
        top: -0.3rem;
        right: -0.4rem;
        background-color: #ffffff;
        padding: 0px 4px;
        color: #ef5e14;
        font-size: 0.7rem;
        border-radius: 1rem;
    }
    .task-modal-title{
        height: 2.5rem;
        text-align: center;
        padding-top: 0.7rem;
        color: #ffffff;
        background-color: #ef5e14;
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;

    }
    .task-modal-content{
        text-align: center;
    }
    .task-modal-group{
        margin: 0 0.5rem;
    }
    .task-modal-list{
        padding: 0;
        padding-right:0.5rem;
        padding-top: 0.5rem;
        padding-bottom:0.5rem;
        border-bottom: 1px solid #C3BFBF;
    }
    .task-modal-btn{
        font-size: 0.7rem;
        height: 1.2rem;
        padding: 0 0.7rem;
        line-height: 1.2rem;
    }
    .task-title{
        text-align: left;
        font-size:0.7rem;
    }
    .task-goods-title{
        padding-left: 0.5rem;
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
        text-align: left;
    }
    .task-modal-goods{
        width: 100%;
    }
    .item-goods{
        width:33%;
        float: left;
    }
    .task-goods-name{
        text-align: center;
        color: #949090;
    }
    .task-goods-img{
        border-radius: 0.5rem;
        width: 2.5rem;
        height: 2.5rem;
    }
    .empty-tip{
        text-align: center;
    }
    #bottomreward p{
        text-align: left;
    }
    .goods-hr{
        border-bottom: 1px solid #C3BFBF;
        margin-bottom: 1rem;
    }
</style>


<div class='fui-page  fui-page-current'>


    <div class="fui-content">
        {if !empty($advs)}
        <div class='fui-swipe'>
            <div class='fui-swipe-wrapper'>
                {loop $advs $item}
                <div class='fui-swipe-item' {if !empty($item['link'])}onclick="location.href='{$item['link']}'"{/if}>
                <img src="{php echo tomedia($item['thumb'])}"/>
                </div>
            {/loop}
            </div>
            <div class='fui-swipe-page'></div>
        </div>
        {/if}

        <div class="fui-tab fui-tab-danger">
            <a data-href="canget" class="active tasktab">可领取</a>
            <a data-href="runninga" class="tasktab">正在进行</a>
            <a data-href="complete" class="tasktab">已完成</a>
            <a data-href="faile" class="tasktab">已失效</a>
        </div>

        <div class="fui-list-group fui-list-group-o task-list" id="canget">
            {if !empty($task_list) }
            {loop $task_list $value}
            <a class="fui-list" href="{php echo mobileUrl('task/gettaskinfo',array('id'=>$value['id']),true);}" data-nocache="true">

                <div class="fui-list-media">
                    <img src="{$value['titleicon']}" style="width: 1.2rem;" >
                </div>
                <div class="fui-list-inner">
                    <div class="title">{$value['title']} <span class="tag tag-blue2 tag-big">海报</span> </div>
                    <div class="subtitle">
                        {if !empty($value['is_credit']) }<span class="tag tag-orange">积分</span>{/if}
                        {if !empty($value['is_bribery']) }<span class="tag tag-red">红包</span>{/if}
                        {if !empty($value['is_money']) }<span class="tag tag-pink">余额</span>{/if}
                        {if !empty($value['is_goods']) }<span class="tag tag-success">指定价格的商品</span>{/if}
                        {if !empty($value['is_coupon']) }<span class="tag tag-primery">优惠券</span>{/if}
                    </div>
                </div>
                <div class="fui-remark" style="width: 5rem">
                    <div class="btn btn-danger task-btn gettask" >领取任务</div>
                </div>

            </a>
        {/loop}
        {else}
        <div class="fui-list">
            <div class="fui-list-inner">
                <div class="empty-tip">暂无任务信息..</div>
            </div>
        </div>
        {/if}
        </div>

        <div class="fui-list-group fui-list-group-o task-list" id="runninga" style="display: none;">
            {if !empty($task_running) }
            {loop $task_running $value}
            <div class="fui-list">
                <div class="fui-list-media">
                     <img src="{$value['titleicon']}" style="width: 1.2rem;" >
                </div>
                <div class="fui-list-inner">
                    <div class="title">{$value['title']} <span class="tag tag-blue2 tag-big">海报</span> </div>
                    <div class="subtitle">
                        {if !empty($value['is_credit']) }<span class="tag tag-orange">积分</span>{/if}
                        {if !empty($value['is_bribery']) }<span class="tag tag-red">红包</span>{/if}
                        {if !empty($value['is_money']) }<span class="tag tag-pink">余额</span>{/if}
                        {if !empty($value['is_goods']) }<span class="tag tag-success">指定价格的商品</span>{/if}
                        {if !empty($value['is_coupon']) }<span class="tag tag-primery">优惠券</span>{/if}
                    </div>
                </div>
                <div class="fui-remark" style="width: 5rem">
                    <div class="btn btn-danger task-btn disabled " data-value="{$value['keyword']}" style="background-color: #ef5e14;border-color: #ef5e14;color: #ffffff;">正在进行</div>
                    <p class="task-num">已完成{$value['completecount']}</p>
                </div>
            </div>
            {/loop}
            {else}
            <div class="fui-list">
                <div class="fui-list-inner">
                    <div class="empty-tip">暂无任务信息..</div>
                </div>
            </div>
            {/if}
        </div>

        <div class="fui-list-group fui-list-group-o task-list" id="complete" style="display: none;">
            {if !empty($task_complete) }
            {loop $task_complete $value}
            <div class="fui-list">
                <div class="fui-list-media">
                    <img src="{$value['titleicon']}" style="width: 1.2rem;" >
                </div>
                <div class="fui-list-inner">
                    <div class="title">{$value['title']} <span class="tag tag-blue2 tag-big">海报</span> </div>
                    <div class="subtitle">
                        {if !empty($value['is_credit']) }<span class="tag tag-orange">积分</span>{/if}
                        {if !empty($value['is_bribery']) }<span class="tag tag-red">红包</span>{/if}
                        {if !empty($value['is_money']) }<span class="tag tag-pink">余额</span>{/if}
                        {if !empty($value['is_goods']) }<span class="tag tag-success">指定价格的商品</span>{/if}
                        {if !empty($value['is_coupon']) }<span class="tag tag-primery">优惠券</span>{/if}
                    </div>
                </div>
                <div class="fui-remark" style="width: 5rem">
                    <a href="{php echo mobileUrl('task/getcompleteinfo',array('id'=>$value['join_id']),true);}"><div class="btn btn-danger task-btn ">查看详情</div></a>
                </div>
            </div>
            {/loop}
            {else}
            <div class="fui-list">
                <div class="fui-list-inner">
                    <div class="empty-tip">暂无任务信息..</div>
                </div>
            </div>
            {/if}
        </div>

    <div class="fui-list-group fui-list-group-o task-list" id="faile" style="display: none;">
        {if !empty($faile_complete) }
        {loop $faile_complete $value}
        <div class="fui-list">
            <div class="fui-list-media">
                <img src="{$value['titleicon']}" style="width: 1.2rem;" >
            </div>
            <div class="fui-list-inner">
                <div class="title">{$value['title']} <span class="tag tag-blue2 tag-big">海报</span> </div>
                <div class="subtitle">
                    {if !empty($value['is_credit']) }<span class="tag tag-orange">积分</span>{/if}
                    {if !empty($value['is_bribery']) }<span class="tag tag-red">红包</span>{/if}
                    {if !empty($value['is_money']) }<span class="tag tag-pink">余额</span>{/if}
                    {if !empty($value['is_goods']) }<span class="tag tag-success">指定价格的商品</span>{/if}
                    {if !empty($value['is_coupon']) }<span class="tag tag-primery">优惠券</span>{/if}
                </div>
            </div>
            <div class="fui-remark" style="width: 5rem">
                <div class="btn btn-danger task-btn disabled " >已失效</div>
        </div>
    </div>
    {/loop}
    {else}
    <div class="fui-list">
        <div class="fui-list-inner">
            <div class="empty-tip">暂无任务信息..</div>
        </div>
    </div>
    {/if}
</div>

    </div>

</div>


<script type="text/javascript">
    $(document).ready(function () {
       setTimeout(function () {
           var tabpagenow = '{$tabpage}';
           if(tabpagenow!=''){
               $('.fui-list-group').hide();
               $('.tasktab').attr('class','tasktab');
               $('a[data-href="'+tabpagenow+'"]').attr('class','tasktab active');
               $('#'+tabpagenow).show();
           }
       },500);
    });
    var taskget = '';
    $('.tasktab').click(function () {
        var tabpage = $(this).data('href');
        $('.fui-list-group').hide();
        $('.tasktab').attr('class','tasktab');
        $(this).attr('class','tasktab active');
        $('#'+tabpage).show();
    });

</script>
<!--底部菜单-->
{if $is_menu==1}
{php $this->footerMenus()}
{/if}
{template '_footer'}

